<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>欢乐大转盘</title>

	<link href="../css/style.css" rel="stylesheet" type="text/css">
	<link href="../css/base.css" rel="stylesheet" type="text/css">

	<script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src="../js/awardRotate.js"></script>
	<script type="text/javascript" src="../js/wheel.js"></script>
	<script type="text/javascript" src="../js/paramsTool.js"></script>
	<script src="../js/layer.js"></script>

<script type="text/javascript">
	var turnplate={
			restaraunts:[],				//大转盘奖品名称
			colors:[],					//大转盘奖品区块对应背景颜色
			outsideRadius:192,			//大转盘外圆的半径
			textRadius:155,				//大转盘奖品位置距离圆心的距离
			insideRadius:68,			//大转盘内圆的半径
			startAngle:0,				//开始角度

			bRotate:false				//false:停止;ture:旋转
	};
	var host = window.location.origin;
	var cost = 50;
	var add = 0;
	if(host == 'http://weblogin.178dn.net') host = 'http://tempa.178dn.net';
	$(document).ready(function(){

		setTimeout(function () {
			for(var i = 0;i<10;i++){
				listNews();
			}

			setInterval(function () {
				listNews();
			},1500);
		},Math.random() * 5000 + 1000);


		$("a").click(function(){

			if(turnplate.bRotate){
				return false;
			}
		});
		//设置用户金币
		var userCoin = getCookie('coin') || 0;
		var uid =getCookie('wxopenid');
		var sid =getCookie('sid');

		$("#coinNum").html(userCoin);

		//动态添加大转盘的奖品与奖品区域背景颜色
		turnplate.restaraunts = [10,20,30,40,50,60,70,80,90,100];
		turnplate.colors = ["#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF","#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF","#FFF4D6", "#FFFFFF"];


		var rotateTimeOut = function (){
			$('#wheelcanvas').rotate({
				angle:0,
				animateTo:2160,
				duration:8000,
				callback:function (){
					alert('网络超时，请检查您的网络设置！');
				}
			});
		};

		//旋转转盘 item:奖品位置; txt：提示语;
		var rotateFn = function (item, selCoin,coinNum){
			var angles = item * (360 / turnplate.restaraunts.length) - (360 / (turnplate.restaraunts.length*2));
			if(angles < 270){
				angles = 270 - angles;
			}else{
				angles = 360 - angles + 270;
			}
			$('#wheelcanvas').stopRotate();
			$('#wheelcanvas').rotate({
				angle:0,
				animateTo:angles+1800,
				duration:5000,
				callback:function (){

					setCookie('coin',coinNum);
					$("#coinNum").html(coinNum);
					turnplate.bRotate = !turnplate.bRotate;

					if(selCoin > 10){
						//询问框
						layer.open({
							content: '恭喜转到'+selCoin+'欢乐币<br>传说中的藏宝图就在这里,立即前去探险!'
							,btn: ['好的','不要']
							,yes: function(index){
								location.href =host+'/view/fish.html';
								layer.close(index);
							}
						});
					}else if(Math.random() > 0.5){
						//询问框
						layer.open({
							content: '恭喜转到'+selCoin+'欢乐币<br>丰厚奖品在等你,还犹豫什么呢?'
							,btn: ['忍不了了','还是拒绝']
							,yes: function(index){
								location.href =host+'/view/fish.html';
								layer.close(index);
							}
						});
					}else {
						//提示
						layer.open({
							content: '恭喜转到'+selCoin+'欢乐币'
							,skin: 'msg'
							,time: 2 //2秒后自动关闭
						});
					}

				}
			});
		};

		$('.pointer').click(function (){
			if(!userCoin || !uid){
				getWxCode();
				userCoin = getCookie('coin');
				uid =getCookie('wxopenid');
				sid =getCookie('sid');
				$("#coinNum").html(userCoin);
			}

			if(userCoin < cost){				//调支付
				location.href=host+'/view/recharge.html';
			}else {							//大转盘

				if(turnplate.bRotate)return;
				turnplate.bRotate = !turnplate.bRotate;
				userCoin = FloatAdd(userCoin,-cost);
				$("#coinNum").html(userCoin);
				$.ajax({
					url: host+ "/turntable/rotateItem",
					type: "get",
					dataType:'json',
					async:true,//请求是否异步，默认为异步，这也是ajax重要特性
					cache:false,
					headers: {"content-type":"application/json","uid":uid,"flag":3,"sid":sid},
					success:function(data){

						if(data.code){
							layer.open({
								content: data.info
								,skin: 'msg'
								,time: 1.5 //2秒后自动关闭
							});
						}else {
							var selCoin = turnplate.restaraunts[data.item-1];
							userCoin = FloatAdd(userCoin,selCoin);
							rotateFn(data.item,selCoin,userCoin);
						}

					},
					error:function() {
						layer.open({
							content: '位置错误,请退出重试!'
							,skin: 'msg'
							,time: 1.5 //2秒后自动关闭
						});
					}
				});
			}
		});

		$('#sharePage').click(function () {
			location.href = host+'/view/shareCode.html?referee='+uid;
		});

	});

	function listNews(){
		var txt=null;
		var id =Math.floor(Math.random()*92999 +10000);  //10000-102999

		if(Math.random() > 0.4){
			add++;
			var turs = [9,30,35,50,60,70,80,80,100];
			var tur =turs[Math.floor(Math.random()*turs.length)];
			txt = '恭喜用户'+id+'转到了'+tur+'个金币!';
			$("<div style='height: 20px;'></div>").html(txt).appendTo($('#mar'));

		}else {
			add++;
			var cashs = [5,10,20,30,50,90];
			var cash =cashs[Math.floor(Math.random()*cashs.length)];
			txt = '恭喜用户'+id+'兑换了'+cash+'元红包!';
			$("<div style='height: 20px;'></div>").html(txt).appendTo($('#mar'));
		}

		if(add % 30 == 0){
			$("#mar div:lt(15)").remove();
			add = 15;
		}
}

</script>
</head>
<body style="background:#e62d2d;overflow-x:hidden;">
    <img src="../image/coin27.png" id="shan-img" style="display:none;" />
    <img src="../image/2.png" id="sorry-img" style="display:none;" />

	<!--顶部导航-->
	<div class="turn_top">
		<ul>
			<a href="minWheel.html"><li>迷你小转盘</li></a>
			<a href="midWheel.html"><li>乐趣中转盘</li></a>
			<a href="bigWheel.html"><li class="sel">欢乐大转盘</li></a>
		</ul>
	</div>


	<!---大转盘--->
	<div class="banner">
		<div class="turnplate" style="background-image:url(../image/turnplate-bg.png);background-size:100% 100%;">
			<canvas class="item" id="wheelcanvas" width="422px" height="422px"></canvas>
			<img class="pointer" src="../image/turnplate-pointer.png"/>
		</div>
	</div>
	<!--当前信息--->
	<div class="user_coin">
		<div class="img"><img src="../image/bean27.png"></div>
		<div class="coin">当前欢乐币:<label id="coinNum">30</label></div>
		<div class="tips">每次抽奖消耗50欢乐币</div>
	</div>

	<marquee id="mar"  direction="up" behavior="scroll" scrollamount="1" scrolldelay="0" loop="-1"  style="text-align: center;color:yellow; width: 100%; height: 50px;display: none;">
	</marquee>
	<!--底部导航-->
	<div class="spring_bar">
		<a href="minWheel.html">
			<dl class="list">
				<dt class=""><img src="../image/ctb1on.png" /></dt>
				<dd class="tbon">幸运转盘</dd>
			</dl>
		</a>
		<a id="sharePage">
			<dl class="list">
				<dt><img src="../image/ctb2.png" /></dt>
				<dd>推广二维码</dd>
			</dl>
		</a><a href="postCash.html">
		<dl class="list">
			<dt><img src="../image/ctbm.png" /></dt>
			<dd></dd>
		</dl>
	</a><a href="recharge.html">
		<dl class="list">
			<dt>
				<img src="../image/ctb3.png" />
			</dt>
			<dd>充值中心</dd>
		</dl> </a>
		<a href="me.html">
			<dl class="list">
				<dt><img src="../image/ctb4.png" /></dt>
				<dd>个人中心</dd>
			</dl>
		</a>
	</div>
	<!--底部导航end-->

</body>
</html>